<template>
  <div class="home">
    <!-- <img alt="Vue logo" src="../assets/logo.png" /> -->
    <div>{{ obj.title }}</div>
    <div>
      <a-space wrap>
        <a-button type="primary" @click="showmsg()">antd框架</a-button>
      </a-space>
    </div>
    <div style="margin: 20px;" @click="test">测试123dis</div>
    <div style="margin: 20px;" @click="test2">测试time</div>
    <a-modal v-model:open="open" title="Basic Modal" @ok="handleOk">
      <p>Some contents...</p>
      <p>Some contents...</p>
      <p>Some contents...</p>
    </a-modal>
    <!-- <HelloWorld msg="Welcome to Your Vue.js + TypeScript App" /> -->
    <!-- <div v-for="(item, index) in projectList" :key="index" @click="hitOne(item)"> -->
    <div v-for="(item, index) in projectList" :key="index" @click="info">
      <div
        style="
          text-align: left;
          margin: 15px;
          border: 1px solid #eee;
          padding: 5px;
          background: #eee;
          cursor: pointer;
        "
      >
        {{ item.id }}: {{ item.display_name }}
      </div>
    </div>
  </div>
</template>

<script lang="ts">
/* eslint-disable */
import { defineComponent } from "vue";
import HelloWorld from "@/components/HelloWorld.vue"; // @ is an alias to /src
import axios from "axios";
import { message } from "ant-design-vue";

import "@/api/service"; // 仅仅为了执行脚本js而已，不对外暴露变量

export default defineComponent({
  name: "HomeView",
  components: {
    HelloWorld,
  },
  data() {
    return {
      projectList: [],
      obj: {},
      open: false
    };
  },
  mounted() {
    axios.get("https://jsonplaceholder.typicode.com/todos/1").then((res) => {
      console.log(res, "模拟数据mock");
      this.obj = res;
    });
    this.list();
  },
  methods: {
    handleOk() {
      this.open = false
    },
    showmsg(){
      this.open = true
    },
    info() {
      console.log(123);
      message.success('提交成功');
    },
    list() {
      axios.get("/api/list").then((res) => {
        console.log("res---自己写后台", res);
        this.projectList = res as any;
      });
    },
    test(){
      axios.get("/api/test").then((res) => {
        console.log("res---redis", res);
      });
    },
    test2(){
      axios.get("/api/test2").then((res) => {
        console.log("res-3秒过期time-----", res);
      });
    }
    // hitOne(item: any) {
      // console.log(item.id);
      // axios.get("/api/del?aaa=" + item.id).then((res) => {
      //   console.log(res.data);
      //   this.list();
      // });
    // },
  },
});
</script>
